<template>
    <div>
      <p ref="myp">hello vue</p>
      <span ref="mySpam">你好</span>
      <hr>
      <refDemeVue ref="refDemo"/>
      <button @click="toAdd">+1</button>
    </div>
  </template>
  
  <script>
  import refDemeVue from './components/ref-deme.vue'
  export default {
    components:{
      refDemeVue
    },
    mounted(){
      this.getDom()
    },
    methods:{
      getDom(){
        let p = document.querySelector('p')
        console.log(p.innerText);
        console.log(this.$refs.myp.innerText);
        console.log(this.$refs.mySpam.innerText);
      },
      getCom(){
        console.log(this.$ref.refDemo.name);
      },
      toAdd(){
        this.$refs.refDemo.addFn()
      }
    }
  }
  </script>
  
  <style>
  
  </style>